import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva';
import moment from 'moment';
import router from 'umi/router';
import { NumberDivide, DateDiff, FormatnumberZero, Mover, DateStamp } from '@/function.js';

// 视图插件
import {
  BackTop,
  Empty,
  Spin,
  Row,
  Col,
  Card,
  Form,
  Input,
  Select,
  Icon,
  Button,
  Dropdown,
  Menu,
  InputNumber,
  DatePicker,
  Modal,
  message,
  Badge,
  Divider,
  Steps,
  Radio,
  Upload,
} from 'antd';
import { TimelineChartFour } from '@/components/Charts';

// 外部组件
import StandardTable from '@/components/StandardTable';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import Loading from '@/components/Loading/Loading';

// css OR less预编译器
import styles from './All.less';
import StockChart from '../../StockSystem/Forecast/StockChart';

// 图片

/**
 *  Describe:数据连接
 *  Created by xjc on 2019/5/15
 */

@connect(({ fourfunds, loading }) => ({
  fourfunds,
  loading: loading.models.fourfundsRule,
}))
@Form.create()
class Fundanalysis extends PureComponent {
  componentWillMount() {}

  /**
   *  Describe:当前状态
   *  Created by xjc on 2019/5/15
   */

  state = {
    index: 0,
  };

  changeIndex(s) {
    this.setState({
      index: s,
    });
  }

  /**
   *  Describe:视图
   *  Created by xjc on 2019/5/15
   */

  render() {
    const {
      loading,
      fourfunds: { charts },
    } = this.props;
    const { index } = this.state;
    const list = [];
    if (charts.length !== 0) {
      for (let i = 0; i < charts.length; i++) {
        list.push(
          <Col md={12} sm={24}>
            {charts[i].name === 'stock净值' ? (
              <TimelineChartFour
                height={350}
                data={charts[i].list}
                titleMap={{ y1: charts[i].name, y2: 'spy净值' }}
              />
            ) : (
              <TimelineChartFour
                height={350}
                data={charts[i].list}
                titleMap={{ y1: charts[i].name }}
              />
            )}
            {/* <div style={{textAlign:'center',marginLeft:'2%',fontWeight:'600'}}>{charts[i].name}</div> */}
          </Col>
        );
      }
    }
    return (
      <PageHeaderWrapper>
        <Card>{charts.length === 0 ? <Loading /> : <Row>{list}</Row>}</Card>
      </PageHeaderWrapper>
    );
  }

  componentDidMount() {
    const { dispatch } = this.props;

    /* 导入列表数据 */
    dispatch({
      type: 'fourfunds/GetWorth',
      payload: {
        date: '',
      },
      callback: res => {},
    });
  }

  componentWillUnmount() {}
}

export default Fundanalysis;
